<template>
    <el-row class="user-info-form" type="flex" justify="center">
        <div id="alarmPositionBaiduMap" style="width: 100%;min-height: 500px;height: 100%;">暂无位置信息</div>
    </el-row>
</template>
<script>
import BMap from 'BMap'

export default {
    name:'AlarmPosition',
    props: {
        pisionInfo: {
            type: Object,
            required: false
        },
    },
    data() {
        return {
        }
    },
    mounted(){
        let infoObj = this.pisionInfo
        let map = new BMap.Map('alarmPositionBaiduMap')
        let point = new BMap.Point(infoObj.longitude,infoObj.latitude);
            //创建用户头像标注
        let myIcon = new BMap.Icon(
            'resource/ilink_1576228768448.gif',
            new BMap.Size(100, 100), // 视窗大小
            {
                // anchor: new BMap.Size(50, 50),
                imageSize: new BMap.Size(30, 30), // 引用图片实际大小
                imageOffset:new BMap.Size(35, 35)  // 图片相对视窗的偏移
            }
        );
        let marker = new BMap.Marker(point, {icon: myIcon});  // 创建标注*/
        let markerLabelScore = new BMap.Label("<div class='baiduMark-duty'>" + (infoObj.addrDesc) + "</div>",{
            offset: new BMap.Size(-35, -50),
            position: point
        });     
        map.enableScrollWheelZoom(true) //滚轮事件                           
        markerLabelScore.setStyle({
            width: 'auto',
            height:'auto',
            color: '#fff',
            fontSize: '16px',
            backgroundColor: 'none',
            border: 'none',
            borderRadius:"4px",
            textAlign: "left",
            padding: "15px",
            lineHeight: "15px"
        });
        markerLabelScore.setZIndex(10000);
        map.addOverlay(markerLabelScore);  
        map.addOverlay(marker);  
        map.centerAndZoom(point, 16)
    },
}
</script>
<style type="text/css">
    .baiduMark-duty{
        color:#000;
        font-size: 15px;
        font-weight: bold;
    }
</style>